Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Autocomplete] Use getOptionLabel over stringify #19974

Merged
merged 2 commits into from
Mar 4, 2020
Merged

[Autocomplete] Use getOptionLabel over stringify #19974

merged 2 commits into from
Mar 4, 2020

Conversation

a-type
Copy link
Contributor

@a-type a-type commented Mar 4, 2020 •
edited by oliviertassinari
Loading

of options against input value

Closes #19798

Updates createFilterOptions to not provide a default stringify, but still allows the user to specify one. If no stringify is supplied, the filter will use getOptionLabel as passed to useAutocomplete. The goal here is to keep the searching as predictable to the user as possible by matching against what they're actually seeing on screen, without requiring the developer to have to think too much about the inner workings of filtering by default.

@mui-pr-bot
Copy link

mui-pr-bot commented Mar 4, 2020 •
edited
Loading

Details of bundle changes.

Comparing: 05c992e...33d7fa3

bundle Size Change Size Gzip Change Gzip
Autocomplete ▼ -130 B (-0.10% ) 134 kB ▼ -40 B (-0.09% ) 42.2 kB
useAutocomplete ▼ -130 B (-0.87% ) 14.9 kB ▼ -35 B (-0.65% ) 5.36 kB
@material-ui/lab ▼ -130 B (-0.07% ) 199 kB ▼ -17 B (-0.03% ) 58.9 kB
@material-ui/core -- 359 kB -- 98.8 kB
@material-ui/core[umd] -- 318 kB -- 92.1 kB
@material-ui/styles -- 51.4 kB -- 15.4 kB
@material-ui/system -- 16.5 kB -- 4.31 kB
Alert -- 86.6 kB -- 27.3 kB
AlertTitle -- 67.5 kB -- 21.2 kB
AppBar -- 67.4 kB -- 21.1 kB
Avatar -- 68.5 kB -- 21.7 kB
AvatarGroup -- 65.7 kB -- 20.6 kB
Backdrop -- 71.2 kB -- 22 kB
Badge -- 68.7 kB -- 21.3 kB
BottomNavigation -- 65.7 kB -- 20.6 kB
BottomNavigationAction -- 78.8 kB -- 24.9 kB
Box -- 72.3 kB -- 21.8 kB
Breadcrumbs -- 83.6 kB -- 26.5 kB
Button -- 83 kB -- 25.4 kB
ButtonBase -- 77.3 kB -- 24.2 kB
ButtonGroup -- 86.5 kB -- 26.6 kB
Card -- 66.2 kB -- 20.7 kB
CardActionArea -- 78.4 kB -- 24.8 kB
CardActions -- 65.4 kB -- 20.5 kB
CardContent -- 65.3 kB -- 20.4 kB
CardHeader -- 68.4 kB -- 21.5 kB
CardMedia -- 65.7 kB -- 20.6 kB
Checkbox -- 85.4 kB -- 27 kB
Chip -- 85.8 kB -- 26.3 kB
CircularProgress -- 67.4 kB -- 21.2 kB
ClickAwayListener -- 3.84 kB -- 1.54 kB
Collapse -- 71.3 kB -- 22.1 kB
colorManipulator -- 3.88 kB -- 1.52 kB
Container -- 66.5 kB -- 20.8 kB
CssBaseline -- 65.3 kB -- 20.5 kB
Dialog -- 86.2 kB -- 26.9 kB
DialogActions -- 65.4 kB -- 20.5 kB
DialogContent -- 65.6 kB -- 20.5 kB
DialogContentText -- 67.4 kB -- 21.1 kB
DialogTitle -- 67.6 kB -- 21.2 kB
Divider -- 66 kB -- 20.7 kB
docs.landing -- 56.6 kB -- 15.6 kB
docs.main -- 602 kB -- 195 kB
Drawer -- 87.9 kB -- 26.8 kB
ExpansionPanel -- 74.9 kB -- 23.5 kB
ExpansionPanelActions -- 65.4 kB -- 20.5 kB
ExpansionPanelDetails -- 65.3 kB -- 20.4 kB
ExpansionPanelSummary -- 81.4 kB -- 25.7 kB
Fab -- 80.1 kB -- 24.9 kB
Fade -- 27.1 kB -- 9.05 kB
FilledInput -- 76.9 kB -- 23.9 kB
FormControl -- 67.7 kB -- 21.1 kB
FormControlLabel -- 68.8 kB -- 21.6 kB
FormGroup -- 65.4 kB -- 20.5 kB
FormHelperText -- 66.7 kB -- 20.7 kB
FormLabel -- 66.8 kB -- 20.7 kB
Grid -- 68.4 kB -- 21.4 kB
GridList -- 65.8 kB -- 20.6 kB
GridListTile -- 67.1 kB -- 21 kB
GridListTileBar -- 66.6 kB -- 20.8 kB
Grow -- 27.7 kB -- 9.26 kB
Hidden -- 69.3 kB -- 21.7 kB
Icon -- 66.1 kB -- 20.7 kB
IconButton -- 79.4 kB -- 24.8 kB
Input -- 75.9 kB -- 23.7 kB
InputAdornment -- 68.4 kB -- 21.6 kB
InputBase -- 74 kB -- 23.2 kB
InputLabel -- 68.6 kB -- 21.2 kB
LinearProgress -- 68.7 kB -- 21.2 kB
Link -- 69.9 kB -- 22.1 kB
List -- 65.7 kB -- 20.5 kB
ListItem -- 80.3 kB -- 25.1 kB
ListItemAvatar -- 65.4 kB -- 20.5 kB
ListItemIcon -- 65.5 kB -- 20.5 kB
ListItemSecondaryAction -- 65.4 kB -- 20.5 kB
ListItemText -- 68.3 kB -- 21.5 kB
ListSubheader -- 66.1 kB -- 20.8 kB
Menu -- 91.8 kB -- 28.3 kB
MenuItem -- 81.4 kB -- 25.4 kB
MenuList -- 69.3 kB -- 21.7 kB
MobileStepper -- 71.2 kB -- 22.3 kB
Modal -- 14.3 kB -- 5.04 kB
NativeSelect -- 80.1 kB -- 25.3 kB
NoSsr -- 2.17 kB -- 1.03 kB
OutlinedInput -- 77.9 kB -- 24.2 kB
Pagination -- 87.6 kB -- 27 kB
PaginationItem -- 84 kB -- 25.9 kB
Paper -- 65.7 kB -- 20.5 kB
Popover -- 86.2 kB -- 26.7 kB
Popper -- 28.8 kB -- 10.3 kB
Portal -- 2.87 kB -- 1.29 kB
Radio -- 86.4 kB -- 27.3 kB
RadioGroup -- 67.1 kB -- 20.9 kB
Rating -- 73.7 kB -- 23.7 kB
RootRef -- 4.21 kB -- 1.64 kB
ScopedCssBaseline -- 66.2 kB -- 20.7 kB
Select -- 119 kB -- 35.3 kB
Skeleton -- 66.3 kB -- 20.9 kB
Slide -- 29.1 kB -- 9.78 kB
Slider -- 79.1 kB -- 25.2 kB
Snackbar -- 78.6 kB -- 24.5 kB
SnackbarContent -- 66.9 kB -- 21 kB
SpeedDial -- 89.4 kB -- 28.3 kB
SpeedDialAction -- 121 kB -- 38.4 kB
SpeedDialIcon -- 67.9 kB -- 21.3 kB
Step -- 66 kB -- 20.7 kB
StepButton -- 85.5 kB -- 27 kB
StepConnector -- 66.1 kB -- 20.8 kB
StepContent -- 72.5 kB -- 22.6 kB
StepIcon -- 67.9 kB -- 21.2 kB
StepLabel -- 71.9 kB -- 22.3 kB
Stepper -- 68.2 kB -- 21.5 kB
styles/createMuiTheme -- 20.9 kB -- 7.27 kB
SvgIcon -- 66.4 kB -- 20.7 kB
SwipeableDrawer -- 95.3 kB -- 29.9 kB
Switch -- 84.6 kB -- 26.6 kB
Tab -- 79.6 kB -- 25.3 kB
Table -- 65.9 kB -- 20.6 kB
TableBody -- 65.4 kB -- 20.5 kB
TableCell -- 67.4 kB -- 21.2 kB
TableContainer -- 65.3 kB -- 20.4 kB
TableFooter -- 65.5 kB -- 20.5 kB
TableHead -- 65.4 kB -- 20.5 kB
TablePagination -- 145 kB -- 42.6 kB
TableRow -- 65.8 kB -- 20.6 kB
TableSortLabel -- 80.6 kB -- 25.5 kB
Tabs -- 88.6 kB -- 28.3 kB
TextareaAutosize -- 5.19 kB -- 2.17 kB
TextField -- 127 kB -- 37.4 kB
ToggleButton -- 79.4 kB -- 25.1 kB
ToggleButtonGroup -- 66.5 kB -- 20.9 kB
Toolbar -- 65.7 kB -- 20.6 kB
Tooltip -- 105 kB -- 33.1 kB
TreeItem -- 78.5 kB -- 24.8 kB
TreeView -- 71.5 kB -- 22.4 kB
Typography -- 67 kB -- 20.9 kB
useMediaQuery -- 2.56 kB -- 1.06 kB
Zoom -- 27.1 kB -- 9.18 kB

Generated by 🚫 dangerJS against 33d7fa3

@a-type a-type force-pushed the autocomplete-stringify-by-label branch from a2d5318 to 2ec30fc Compare March 4, 2020 01:26
@a-type
Copy link
Contributor Author

a-type commented Mar 4, 2020

Hey y'all. Not sure what argos is - anyone know what the issue might be with the PNG stream?

@oliviertassinari oliviertassinari changed the title [Autocomplete] default getOptionLabel for search [Autocomplete] Use getOptionLabel over stringify Mar 4, 2020
@oliviertassinari oliviertassinari added new feature New feature or request component: autocomplete This is the name of the generic UI component, not the React module! labels Mar 4, 2020
@oliviertassinari
Copy link
Member

oliviertassinari commented Mar 4, 2020 •
edited
Loading

@a-type This Argos issue has been around for a week now, it's frustrating. It originates in the PNG cropping module. It fails in https://github.com/nathanmarks/vrtest/blob/e2240dc018d3392ca232712bb34aef7b80ee1000/src/server/utils/screenshots.js#L5.
The error seems to be identical to pngjs/pngjs#80, but the issue was ignored. I'm clueless.

@oliviertassinari
Copy link
Member

Maybe we should apply the same patch gemini-testing/looks-same#24.

@oliviertassinari oliviertassinari mentioned this pull request Mar 4, 2020
Merged
@oliviertassinari oliviertassinari merged commit 2a0a935 into mui:master Mar 4, 2020
@oliviertassinari
Copy link
Member

@a-type Thanks!

eps1lon pushed a commit to eps1lon/material-ui that referenced this pull request Mar 4, 2020
@a-type @eps1lon
[Autocomplete] Use getOptionLabel over stringify (mui#19974)
47f5b6b
@oliviertassinari oliviertassinari mentioned this pull request Mar 15, 2020
Closed
This was referenced Mar 20, 2020
Merged
Merged
Merged
Merged
Merged
Merged
Merged
EsoterikStare pushed a commit to EsoterikStare/material-ui that referenced this pull request Mar 30, 2020
@a-type @EsoterikStare
[Autocomplete] Use getOptionLabel over stringify (mui#19974)
048ca04
@FernandoGOT FernandoGOT mentioned this pull request Apr 6, 2020
Closed
2 tasks
This was referenced Apr 10, 2020
Closed
Merged
Merged
Merged
@snyk-bot snyk-bot mentioned this pull request Apr 19, 2020
Closed
@snyk-bot snyk-bot mentioned this pull request May 4, 2020
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@oliviertassinari oliviertassinari oliviertassinari approved these changes

Assignees
No one assigned
Labels
component: autocomplete This is the name of the generic UI component, not the React module! new feature New feature or request
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[Autocomplete] Filter based on visible option labels by default
3 participants
@a-type @mui-pr-bot @oliviertassinari